import React, { CSSProperties } from 'react';
import { RightOutlined, borderStyle, udp } from '@cscec/udp-ui';
import { containerStyle } from '../common';
import { render } from 'amis';
import { MicroCmp } from '@/components/MicroApp';

/**
 * 通用业务卡片
 */
export default function CommonBusinessCard({
  style, width, height, more, moreSrc, src, title, mode, microName, microEntry, microPathname, env
}: any) {
  return (
    <div style={{
      ...containerStyle,
      width: width ?? '100%',
      height: height ?? '100%',
      display: 'flex',
      flexDirection: 'column',
      ...style,
    }}
    >
      {(title || moreSrc) && <div style={{ display: 'flex', padding: '12px 16px', ...borderStyle('bottom') }}>
        <span style={{ flex: 1 }}>{title || ''}</span>
        {moreSrc && <a onClick={() => udp.open(moreSrc)}>{more || '更多'}<RightOutlined style={{ marginLeft: 4 }} /></a>}
      </div>}
      <div style={{ flex: 1, height: 0 }}>
        {mode === 'qiankun' && microName && microEntry && microPathname ? <MicroCmp name={microName} entry={microEntry} pathname={microPathname} /> : render({ type: 'iframe', src })}
      </div>
    </div>
  );
}

export interface IProps {
  style?: CSSProperties;
  width?: number;
  height?: number;
  title?: string;
  more?: string;
  moreSrc?: string;
  src?: string;
  mode: 'qiankun' | 'iframe';
  microName?: string;
  microEntry?: string;
  microPathname?: string;
  [x: string]: any;
}
